<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>无标题</title>
</head>
<style type="text/css">
	.max{
		width: 1200px;
		margin: 20px;

	}
	.min{background-color:#6495ED;
		width: 1200px;
		height: 100px;
		padding: 0px;
		margin:0px;

	}
	.a{
		background-color: #87CEFA;
		width: 80px;
		height: 80px;
		margin: 2px;
		text-align: center;
		color: white;
		float: left;

		
	}
	.b{
		background-color:#87CEFA;
		width: 80px;
		height: 80px;
		margin: 2px;
		text-align: center;
		color: white;
				float: left;		
	}
	.c{
		background-color:#87CEFA;
		width: 80px;
		height: 80px;
		margin: 2px;
		text-align: center;
		color: white;
		float: left;
		
	}
	.a1{
		width: 90px;
		height: 70px;
		color: white;
		float: left;
		padding: 30px;
		margin: 5px;
	}
	.a2{
		width: 70px;
		height: 70px;
		color: white;
		float: left;
		padding: 30px;
		margin: 5px
	}
	.a3{
		width: 70px;
		height: 70px;
		color: white;
		float: left;
		padding: 30px;
		margin: 5px;
	}
   .a4{
   	color: white;
   	width: 300px;
   	float: left;

   }
   .left{
   	background-color:#FFFFFF;
   	width: 300px;
   	height: 500px;
   	float: left;
   }
   .left1{
   	background-color:;
   	width: 900px;
   	height: 500px;
   	float: left;
   }
   .aa{
   	background-color:#6495ED;
   	width: 80px;
   	height: 25px;
   	color: white;
   	float: left;
   	margin: 3px;
   	text-align: center;
   }
   .bb{
   	background-color:#6495ED;
   	width: 80px;
   	height: 25px;
   	color: white;
   	float: left;
   	margin: 3px;
   	text-align: center;
   }
   .cc{
   	background-color:#6495ED;
   	width: 80px;
   	height: 25px;
   	color: white;
   	float: left;
   	margin: 3px;
   	text-align: center;
   }
   .dd{
   	background-color:#6495ED;
   	width: 40px;
   	height: 25px;
   	color: white;
   	text-align: center;
   	margin: 2px;
   }
   .ee{
   	background-color: #6495ED;
   	color: white;
   	width: 300px;
   	height: 40px;
   }
   .ff{
   	background-color: #AFEEEE;
   	width: 300px;
   	height: 350px;
   }
   .gg{
   	background-color: #6495ED;
   	color: white;
   	width: 300px;
   	height: 40px;
   }

	h1{
		padding-top:4px;
		}
	
	img{
		padding-top: 8px;
	}
	ul{
		list-style-type: none;
		margin: 0;
		padding:0;
	}
	
	table{
		border-collapse: collapse;
		width: 870px;
		height: 400px;
		text-align: center;
		margin: 4px;
	}
	table,td,th
	{
		border:1px solid green;
	}
	p{text-align: center;}
	a{color: #FFFFFF;text-decoration: none;}
</style>
<body>
<div class="max">
	<div class="min">
		<div class="a4"><h1>智能储物柜管理系统</h1></div>
		<div>
		<ul>
			<li><div class="a">
			<a href=""><img src="../SYS/star.png" width="40" height="40"><br>高级管理</a></li>
		    <li><div class="b">
			<a href=""><img src="star.png" width="40" height="40"><br>历史记录</a></li>
			<li><div class="c">
			<a href=""><img src="star.png" width="40" height="40"><br>其它</a></li>
			<li><div class="a1">
			<a href=""><img src="user.png" width="30" height="30">admin</a></li>
			<li><div class="a2">
			<a href=""><img src="home.png" width="30" height="30">首页</a>
			</li>
			<li><div class="a3">
			<a href=""><img src="exit.png" width="30" height="30">退出</a></li>
			<li><div class="a4"></li>
		</ul>
		</div>
	</div>
	<div class="left">
		<div style="border:1px solid green">
			<div style="text-align:center;"><input type="text" style="height:25px;width:220px;">
			<button type="text" value="搜索">搜索</button>
			</div><br>
			<div class="ee"><h4 style="display:inline">按柜子</h4>
			<img src="noexpand.png" width="30px" height="30px" align="right"></div>
			<div class="ff">
				<ul>
					<li>电容柜</li>
					<li>电阻柜</li>
					<li>电感柜</li>
					<li>二极管</li>
					<li>三极管</li>
					<li>数码管</li>
					<li>排组</li>
					<li>电机</li>
					<li>驱动芯片</li>
					<li>稳压芯片</li>
				</ul>
			</div>
			<div class="gg"><h4 style="display:inline">按类型</h4>
			<img src="expand.png" width="30px" height="30px" align="right"></div>
		</div>
	</div>
	<div class="left1">
	<div style="border:1px solid green">
		<div>
			<ul>
				<a href=""><li><div class="aa">柜子管理</a></li>
				<a href=""><li><div class="bb">元器件管理</a></li>
				<a href=""><li><div class="cc">用户管理</a></li>
			</ul>
		</div>
		<br><br><hr/>
		<div class="dd"><a href="">添加</a></div>	
		<div>
			<table>
				<tr>
					<th>名称</th>
					<th>描述</th>
					<th>操作</th>
				</tr>
				<tr>
					<td>电容柜</td>
					<td>这是存放电容的柜子，有电解电容，普通电容等等</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>电阻柜</td>
					<td>第二排第三个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>电感柜</td>
					<td>第一排第四个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>二极管</td>
					<td>第一排第三个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>三极管</td>
					<td>第一排第二个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>数码管</td>
					<td>第二排第二个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>排阻</td>
					<td>第二排第八个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>电机</td>
					<td>第二排第二个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>驱动芯片</td>
					<td>第二排第七个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
				<tr>
					<td>稳压芯片</td>
					<td>第二排第五个</td>
					<td><a href="" style="color:blue">修改</a>/<a href="" style="color:blue">删除</a></td>
				</tr>
			</table><p>10条记录1/1页</p>
		</div>
	</div>
</div>
</body>
</html>
</head>